<template>
  <div class="custom-hook">
    <div>当前求和为：{{ sum }}</div>
    <button @click="sumAdd">click sum add 1</button>
    <img v-for="(dog, index) in dogList" :src="dog" :key="index" />
    <button @click="getDog">再来一只小狗</button>
  </div>
</template>

<script lang="ts" setup name="CustomHook">
import useSum from "@/hooks/useSum";
import useDog from "@/hooks/useDog";
const { sum, sumAdd } = useSum();
const { dogList, getDog } = useDog();
</script>

<style scoped>
.custom-hook {
  background-color: skyblue;
  box-shadow: 0 0 10px;
  border-radius: 10px;
  padding: 20px;
}
img {
  object-fit: contain;
  height: 100px;
}
</style>